<template>
  <view class="content-i">
    <image
        class="bg"
        :src="EnumBG.HI"
        mode="widthFix"
      ></image>

      <!-- <image
        class="h-button-def"
        :class=" sizeStatus ? 'h-button':'h-button-samll'"  
        src="@/static/button/tip.png"
        mode="widthFix"
    ></image> -->
        <input class="input input-w" v-model="wh" :style="{ 'background-image': 'url(' + EnumBG.BU5 + ')' }"  placeholder-style="color:#fff" placeholder="请输入父亲的身高(cm)"  />
        <input class="input input-m" v-model="mh" :style="{ 'background-image': 'url(' + EnumBG.BU5 + ')' }" placeholder-style="color:#fff" placeholder="请输入母亲的身高(cm)"  />

        <view class="to-r"  :class=" sizeStatus ? 'h-button':'h-button-samll'"   :style="{ 'background-image': 'url(' + EnumBG.BU9 + ')' }"  @click="updateStatus">立即查看</view>
  </view>
  <LandscapeModel v-model:show="show" :sonFun="sonFun"/>
</template>

<script setup lang="ts">
import {EnumHeight} from "../content";
import { EnumBG } from "@/utils/content";
import LandscapeModel from "@/components/Landscape/LandscapeModel.vue";

const show = ref(false)
const sizeStatus = ref(false)
const emit = defineEmits(['update:defStatus','update:ws','update:ms'])
const wh = ref()
const mh = ref()
const startTimer = () => {
setInterval(() => {
    sizeStatus.value =  !sizeStatus.value
}, 1000); // 每秒执行一次
};
const updateStatus = ()=>{
    if(!wh.value || !mh.value){
        uni.showToast({
            title: '请输入父母亲的身高',
            duration: 2000,
            icon:"none"
        }); 
        return
    }

    try{
        if(isNaN(wh.value) && isNaN(mh.value)){
            uni.showToast({
            title: '请输入数值',
            duration: 2000,
            icon:"none"
        }); 
        return  
        }
    }catch(e:any){
        uni.showToast({
            title: '请输入数值',
            duration: 2000,
            icon:"none"
        }); 
        return
    }
    show.value = true
}

const sonFun = ()=>{
    const ms = ((Number(wh.value) + Number(mh.value)) * 0.54).toFixed(2)
    const ws = (( Number((wh.value * 0.923))+  Number(mh.value)) * 0.5).toFixed(2)
    emit('update:ms',ms)
    emit('update:ws',ws)
    uni.hideLoading();
    emit('update:defStatus',EnumHeight.RESULT)
}
onMounted(()=>{
    startTimer();
})

</script>

<style lang="scss" scoped>
.content-i{
    width: 100%;
    height: 100%;
    letter-spacing: 2px;
    .bg{
        width: 100%;
    }
    .h-button-def{
        position: absolute;
        z-index: 99;
        top: 71%;
        height: 170rpx;
        left: 47.5%;
    }
    .input{
        width: 605rpx;
        height: 130rpx;
        position: absolute;
        z-index: 99;
        top: 59%;
        left: 10%;
        line-height: 130rpx;
        text-align: center;
        color: white;
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }
    .input-w{
        top: 59%;
    }
    .input-m{
        top: 42.5%;
    }
    .to-r{
        width: 305rpx;
        height: 115rpx;
        position: absolute;
        z-index: 98;
        top: 83%;
        left: 31%;
        line-height: 115rpx;
        text-align: center;
        color: white;
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }
    .h-button{
        width: 325rpx;
        height: 130rpx;
        line-height: 130rpx;
        left: 30%;
        transition: all 1s;
    }
    .h-button-samll{
        width: 305rpx;
        height: 115rpx;
        left: 31%;
        transition: all 1s;
    }
}

</style>
